<template>
  <div>
    <span v-show="isok">v-show显示</span>
    <br />
    <span v-if="isok">v-if显示</span>
    <hr />
    <span v-if="is">v-if18</span>
    <span v-else>v-if20</span>
  </div>
</template>

<script>
// 目标：v-if和v-show控制标签显示/隐藏
// 语法：
// v-show=“vue变量”
// v-if=“vue变量”
// 区别：
// v-show隐藏时，使用display：none来隐藏
// v-if隐藏时，直接从Dom上移除
// 频繁切换显示/隐藏时，v-show好一点，css开销，比dom频繁创建销毁要低一些
// v-if和v-else互斥标签使用，有你没我，有我没有你

export default {

  data () {
    return {
      isok: true,
      is: false


    }
  }
}
</script>

<style>
</style>